import 'package:flutter/material.dart';

//Flutter核心基础 - 底部菜单栏 BottomNavigationBar与PageView结合实现标签页面
void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  //当前显示 的页面  索引
  int _currentIndex = 0;
  //PageView
  late PageController _pageController;

  //页面创建的时候 创建
  @override
  void initState() {
    super.initState();
    _pageController = PageController(initialPage: 0);
  }

  @override
  void dispose() {
    super.dispose();
    _pageController.dispose();
  }

  @override
  Widget build(BuildContext context) {
    //脚手架
    return Scaffold(
      appBar: AppBar(
        title: Text('标题'),
        backgroundColor: Colors.blue,
        foregroundColor: Colors.white,
      ),

      bottomNavigationBar: BottomNavigationBar(
        currentIndex: _currentIndex,
        //点击
        onTap: (int index) {
          //跳转页面
          //_pageController.jumpToPage(index);
          //动画的方式 切换
          _pageController.animateToPage(
            index,
            duration: Duration(milliseconds: 400),
            curve: Curves.ease,
          );
          setState(() {
            _currentIndex = index;
          });
        },
        items: [
          BottomNavigationBarItem(
            icon: Badge(
              child: Icon(Icons.home),
              label: Text('99+'),
              isLabelVisible: true,
            ),
            label: '首页',
          ),
          BottomNavigationBarItem(icon: Icon(Icons.business), label: '业务'),
          BottomNavigationBarItem(icon: Icon(Icons.school), label: '学习'),
          BottomNavigationBarItem(icon: Icon(Icons.person), label: '我的'),
        ],
        selectedItemColor: Colors.blue,
        unselectedItemColor: Colors.grey,
        showUnselectedLabels: true,
      ),
      body: PageView(
        controller: _pageController,
        //禁用滑动
        physics: NeverScrollableScrollPhysics(),
        //页面滑动监听
        onPageChanged: (int index) {
          setState(() {
            _currentIndex = index;
          });
        },
        children: [
          PageContent2(color: Colors.blue, iconData: Icons.home, title: '首页'),
          PageContent2(
            color: Colors.green,
            iconData: Icons.business,
            title: '业务',
          ),
          PageContent2(
            color: Colors.orange,
            iconData: Icons.school,
            title: '学习',
          ),
          PageContent2(
            color: Colors.purple,
            iconData: Icons.person,
            title: '我的',
          ),
        ],
      ),
    );
  }
}

class PageContent2 extends StatefulWidget {
  final Color color;
  final IconData iconData;
  final String title;
  PageContent2({
    required this.color,
    required this.iconData,
    required this.title,
  });
  @override
  State<StatefulWidget> createState() {
    return PageContent2State();
  }
}

class PageContent2State extends State<PageContent2>
    with AutomaticKeepAliveClientMixin {
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    print('${widget.title}页面创建了');
  }

  @override
  void dispose() {
    super.dispose();
    print('${widget.title}页面销毁了');
  }

  @override
  bool get wantKeepAlive => true;

  @override
  Widget build(BuildContext context) {
    super.build(context);
    return Container(
      color: widget.color.withValues(alpha: 0.1),
      child: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Icon(widget.iconData, size: 80, color: widget.color),
            SizedBox(height: 20),
            Text(
              widget.title,
              style: TextStyle(
                fontSize: 24,
                fontWeight: FontWeight.bold,
                color: widget.color,
              ),
            ),
            SizedBox(height: 20),
            Text('这是 ${widget.title} 页面内容 ', style: TextStyle(fontSize: 16)),
          ],
        ),
      ),
    );
  }
}

class PageContent extends StatelessWidget {
  final Color color;
  final IconData iconData;
  final String title;
  PageContent({
    required this.color,
    required this.iconData,
    required this.title,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      color: color.withValues(alpha: 0.1),
      child: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Icon(iconData, size: 80, color: color),
            SizedBox(height: 20),
            Text(
              title,
              style: TextStyle(
                fontSize: 24,
                fontWeight: FontWeight.bold,
                color: color,
              ),
            ),
            SizedBox(height: 20),
            Text('这是 $title 页面内容 ', style: TextStyle(fontSize: 16)),
          ],
        ),
      ),
    );
  }
}
